<template>
	<view class="pageContent">
		<!-- 项目详情 -->
		<ordetailModal ref="pop1" :ndata="curTapItem" :ndataInfo="dataList"></ordetailModal>
		<view class="aprTitBox flex" :class="{ shaw: navShaw }">
			<view v-for="(item, index) in navList" :key="index" :class="{ active: index === navClass }" class="titItem" @click="tapNav(index)">{{ item.name }}</view>
		</view>
		<block v-for="(item, index) in navList" :key="index">
			<view v-if="navClass === index" class="aprMainBox">
				<view v-if="item.loaded && item.list.length == 0" class="emptyOder flex flex-direction align-center">
					<view class="emptyImg"><image src="../../../static/empty.png" mode="aspectFill"></image></view>
					<view class="emty-ds">暂无数据</view>
					<!-- <view class="emty-btn" @tap="gotoHome">去逛逛</view> -->
				</view>
				<view
					v-for="(citem, cindex) in item.list"
					:key="cindex"
					:class="{ act: citem.bill_status == '813' || citem.bill_status == '986' || citem.bill_status == '987' }"
					class="consumItem p_rlt"
					@click="mnavTo('/pages/order/orderDetail/orderDetail?bill_id=' + citem.bill_id)"
				>
					<view v-if="citem.bill_source=='62'" class="mtipsico text-acenter text-xs text-white">
						美团
					</view>
					<view class="cs_tit flex align-center">
						<view class="cs_cname flex-sub text-cut">
							<view class="aconIcoBox"><text class="acon-mendian"></text></view>
							{{ citem.sellerMemberName || '' }}
						</view>
						<!-- :class="{citem.bill_status == '000'?'text-nred':'text-c6'}" 待支付 -->
						<view class="cs_odid text-c6" >
							<!-- 827 -->
							{{
								citem.bill_status == '988'
									? '已完成'
									: citem.bill_status == '225'
									? '已关闭'
									: citem.bill_status == '813'
									? '待消费'
									: citem.bill_status == '987'
									? '服务中'
									: ''
							}}
							<!-- 待支付 -->
							<!-- <text class="text-nred text-df margin-left-xxs">
								<text class="text-xxs">￥</text>
								70
							</text> -->
						</view>
					</view>
					<view class="cs_vproList">
						<view v-for="(bitem, bindex) in citem.ext?.billRoomInfos" :key="bindex"  class="vproItem text-df">
							<view v-if="bitem.goods_type == '975' || bitem.goods_type == '811'">
							<view class="flex">
								<view class="flex-sub flex align-center">
									<view class="vservPro d_ib padding-right-xs">
										<view
											v-if="
												citem.isDisplayTechnicianNo=='5' || bitem.referrer_type == '1001'
											"
											class="text-bold"
										>
										<!-- ||(citem.isDisplayTechnicianNo!='5' && (bitem.referrer_type == '1001' || (bitem.status != '225' && bitem.status != '813'))) -->
											{{ bitem.craftsman_goods_name || '' }}
										</view>
										<view v-else class="text-bold">
											<text>{{ bitem.service_goods_name || '' }}</text>
											<text>{{ bitem.vsku_name ? '/' + bitem.vsku_name || '' : '' }}</text>
										</view>
									</view>
									<view class="dian" v-if="bitem.referrer_type == '1001'">点</view>
								</view>
								<view class="vptime flex align-center" @click.stop="tapDetail(bitem, citem)">
								<!-- <view class="vptime flex align-center"> -->
									<text class="text-bold text-c6">￥{{ bitem.nmoney || '' }}</text>
									<text class="cuIcon-info text-c9 tit_tah"></text>
									<!-- <block v-if="bitem&&bitem.startTime&&bitem.endTime">
										{{(transSubTime((bitem&&bitem.startTime?bitem.startTime:''),':') + '-' + transSubTime((bitem&&bitem.endTime?bitem.endTime:''),':'))}}
									</block> -->
								</view>
								</view>
							</view>
							<view class="margin-top flex">
								<view
									v-if="citem.isDisplayTechnicianNo=='5' ||bitem.referrer_type == '1001'"
									class="flex-sub text-c6"
								>
								<!-- ||(citem.isDisplayTechnicianNo!='5' && (bitem.referrer_type == '1001' || (bitem.status != '225' && bitem.status != '813'))) -->
									<text>{{ bitem.service_goods_name || '' }}</text>
									<text>{{ bitem.vsku_name ? '/' + bitem.vsku_name || '' : '' }}</text>
									<text v-if="citem.status=='988'||(citem.isDisplayRoomNo=='5'&&bitem.room_goods_name)" class="text-c6">{{ '/' + bitem.room_goods_name + '房' }}</text>
								</view>
								<view v-else class="flex-sub text-c6">
									<!-- citem.status=='988'|| -->
									<text v-if="citem.isDisplayRoomNo=='5'" class="text-c6">{{ bitem.room_goods_name + '房' }}</text>
								</view>
								<view class="text-c9">
									<block v-if="bitem && bitem.startTime && bitem.endTime">
										{{
											transSubTime(bitem && bitem.startTime ? bitem.startTime : '', ':') +
												'-' +
												transSubTime(bitem && bitem.endTime ? bitem.endTime : '', ':')
										}}
									</block>
									{{ bitem.time_nums ? '/' + bitem.time_nums + '个钟' : '' }}
								</view>
							</view>
							<view v-if="bindex < citem.billInfoList.length - 1" class="linv dashed-bottom"></view>
						</view>
					</view>
					<!-- <scroll-view class="cs_proList" scroll-x="true" >
						<view>
							<block>
								<view v-for="(bitem,bindex) in citem.billInfoList" :key="bindex" v-if="bitem.goods_type=='975'" class="csproItem">
									<view class="csname">
										{{bitem.ext&&bitem.ext.serviceGoods?(bitem.ext.serviceGoods.name||''):''}}
									</view>
									<view class="cstime act">
										<block v-if="bitem&&bitem.ext&&bitem.ext.time&&bitem.ext.time.start_time&&bitem.ext.time.end_time">
											{{(transSubTime((bitem&&bitem.ext&&bitem.ext.time?bitem.ext.time.start_time:''),':') + '-' + transSubTime((bitem&&bitem.ext&&bitem.ext.time?bitem.ext.time.end_time:''),':'))}}
										</block>
										
									</view>
									<view class="csnum text-cut">
										{{bitem.ext&&bitem.ext.craftsman?(bitem.ext.craftsman.name||''):''}}号<text class="mlfs">({{bitem.ext&&bitem.ext.time?(bitem.ext.time.time_nums||'0') + '个钟':''}})</text>
									</view>
								</view>
							</block>
							
						</view>
					</scroll-view> -->
					<view class="cs_botsc flex align-center">
						<view v-if="citem.billInfoList.length && citem.billInfoList[0].startTime" class="bot_time flex-sub">
							{{ transDay(citem.billInfoList[0] ? citem.billInfoList[0].startTime || '' : '') }}
						</view>
						<view v-if="citem.total_money >= 0" class="flex-sub text-end text-bold text-df">小计&nbsp;￥{{ citem.total_money||0}}
						</view>
					</view>
					<view class="cs_botsc flex align-center justify-end">
						<!-- v-if="citem.bill_status!='225'" -->
						<view
							v-if="citem.bill_status == '813' || citem.bill_status == '986' || citem.bill_status == '987'"
							class="bot_btn ag"
							@click.stop="tapItemBtn(cindex, citem.bill_id, citem.bill_status)"
						>
							取消
						</view>
						<view
							v-if="citem.bill_status == '225' || citem.bill_status == '988'"
							class="bot_btn_del ag"
							@click.stop="tapItemBtn(cindex, citem.bill_id, citem.bill_status)"
						>
							删除
						</view>
					</view>
				</view>
				<!-- <view class="consumItem act" @click="navigateTo('/order/orderDetail/orderDetail?pageCode=1001')">
					<view class="cs_tit flex align-center">
						<view class="cs_cname flex-sub text-cut">
							隆平园店
						</view>
						<view class="cs_odid text-c6">
							待服务
						</view>
					</view>
					<scroll-view class="cs_proList" scroll-x="true" >
						<view>
							<view v-for="(item,index) in 5" :key="index" class="csproItem">
								<view class="csname">
									艾灸
								</view>
								<view class="cstime act">
									12:00-13:00
								</view>
								<view class="csnum">
									99号<text class="margin-left-xs">(1)</text>
								</view>
							</view>
						</view>
					</scroll-view>
					<view class="cs_botsc flex align-center">
						<view class="bot_time flex-sub">
							2021-03-25  14:19
						</view>
						<view class="bot_btn ag">
							取消
						</view>
					</view>
				</view> -->
				<uni-load-more :status="item.loadingType"></uni-load-more>
			</view>
			<!-- <view v-if="navClass===1" class="aprMainBox">
				<view class="consumItem act" @click="navigateTo('/order/orderDetail/orderDetail?pageCode=1001')">
					<view class="cs_tit flex align-center">
						<view class="cs_cname flex-sub text-cut">
							隆平园店
						</view>
						<view class="cs_odid text-c6">
							待服务
						</view>
					</view>
					<scroll-view class="cs_proList" scroll-x="true" >
						<view>
							<view v-for="(item,index) in 5" :key="index" class="csproItem">
								<view class="csname">
									艾灸
								</view>
								<view class="cstime act">
									12:00-13:00
								</view>
								<view class="csnum">
									99号<text class="margin-left-xs">(1)</text>
								</view>
							</view>
						</view>
					</scroll-view>
					<view class="cs_botsc flex align-center">
						<view class="bot_time flex-sub">
							2021-03-25  14:19
						</view>
						<view class="bot_btn ag">
							取消
						</view>
					</view>
				</view>
			</view>
			<view v-if="navClass===2" class="aprMainBox">
				<view class="consumItem" @click="navigateTo('/order/orderDetail/orderDetail')">
					<view class="cs_tit flex align-center">
						<view class="cs_cname flex-sub text-cut">
							隆平园店
						</view>
						<view class="cs_odid text-c6">
							已完成
						</view>
					</view>
					<scroll-view class="cs_proList" scroll-x="true" >
						<view>
							<view v-for="(item,index) in 3" :key="index" class="csproItem">
								<view class="csname">
									艾灸
								</view>
								<view class="cstime act">
									12:00-13:00
								</view>
								<view class="csnum">
									99号<text class="margin-left-xs">(1)</text>
								</view>
							</view>
						</view>
					</scroll-view>
					<view class="cs_botsc flex align-center justify-end">
						<view class="bot_btn ag">
							再次预约
						</view>
					</view>
				</view>
			</view> -->
		</block>
		<loading></loading>
	</view>
</template>

<script lang="ts" setup>
	import { ref } from "vue";
	import { onLoad,onShow,onPageScroll,onUnload,onPullDownRefresh,onReachBottom } from '@dcloudio/uni-app';
	import { getCraftsmanSwitcht,getOrderListt,changeOrderStatust,cancelOdert } from '@/api/vmeitime-http/index.js'
	import { mnavTo, showLoading, hideLoading,getTime} from '@/utils/helper';
	import mapi from '@/utils/mapi';
	import { useShopStore } from '@/stores/shopStore';
	
	const shopStore = useShopStore()
 const navClass=ref(0)
 const loadingType=ref('')
 const curTapItem=ref({})
 const dataList=ref({})
 const navShaw=ref(false)
 const navList=ref<any>([
 	{
 		id: '0',
 		bill_status: '',
 		name: '全部',
 		loaded:false,
 		curPage: 1,
 		list: [],
 		isEmpty: false,
 		loadingType: 'none'
 	},
 	{
 		id: '1',
 		bill_status: '813',
 		name: '待消费',
 		loaded: false,
 		curPage: 1,
 		list: [],
 		isEmpty: false,
 		loadingType: 'none'
 	},
 	{
 		id: '2',
 		bill_status: '987',
 		name: '服务中',
 		loaded: false,
 		curPage: 1,
 		list: [],
 		isEmpty: false,
 		loadingType: 'none'
 	},
 	{
 		id: '3',
 		bill_status: '988',
 		name: '已完成',
 		loaded:false,
 		curPage: 1,
 		list: [],
 		isEmpty: false,
 		loadingType: 'none'
 	}
 ])
 const shopSet=ref({})
 const pop1=ref()
 onLoad(()=>{
	 loadData()
 })
 onShow(()=>{
	 if (navList.value[navClass.value].loaded) {
	 			refresh();
	 		}
 })
 onPageScroll((e)=>{
	 e.scrollTop > 10 ? (navShaw.value = true) : (navShaw.value = false);
 })
 onUnload(()=>{
	 hideLoading()
 })
 onPullDownRefresh(()=>{
	 refresh()
 })
 //加载更多
 onReachBottom(()=>{
	 loadData()
 })
 const loadData=(source:any = '') =>{
 	 getOrderList(source);
 }
 const getCraftsmanSwitch=async()=> {
		showLoading({
			title: '',
			mask: true
		});
		try{
			let res=await getCraftsmanSwitcht({ sellerMemberId: shopStore.curSellerMemberId })
			if (res.result) {
				shopSet.value = res.object||{};
			}
			loadData();
		}catch(e){
			loadData();
		}
 }
 const refresh=()=> {
 	navList.value[navClass.value].curPage = 1;
 	loadData('refresh');
 }
 const getOrderList=async(source:any='')=> {
 	let curItem = navList.value[navClass.value];
 	uni.stopPullDownRefresh();
 	if (curItem.loaded === 'loaded' && curItem.loadingType === 'loading') {
 		//防止重复加载
 		return;
 	}
 	if (source === 'refresh' && loadingType.value == 'loading') {
 		return;
 	}
 	if (source === 'tapClick' && curItem.loaded === 'loaded') {
 		return;
 	}
 	if (source === 'add' && curItem.loadingType === 'noMore') {
 		return;
 	}
 	loadingType.value = 'loading';
 	if (source === 'add') {
 		curItem.loadingType = 'loading';
 	} else {
 		showLoading({
 			title: '',
 			mask: true
 		});
 	}
 	// this.craftsman_no_show == false ? 6 : 5
	try{
		let res:any=await getOrderListt({ bill_status: curItem.bill_status, curPage: curItem.curPage, craftsmanNoShow: 5 })
		 curItem.loaded = true;
		 hideLoading()
		 if (!res.result || !res.object) {
		 	curItem.loadingType = 'none';
		 	mapi.msg(res.shortMessage || '网络繁忙，请稍后..', res.code);
		 	return;
		 }
		 curItem.curPage += 1;
		 loadingType.value = '';
		 let nres = res.object || {};
		 let nlist = nres.result || [];
		 let npage = nres.page || {};
		 source === 'refresh' ? (curItem.list = []) : '';
		 // for (let i = 0; i < nlist.length; i++) {
		 // 	let nitem = nlist[i]
		 // 	if(nitem.bill_status!='827'&&nitem.create_time){
		 // 		let ntime = this.$getTime(nitem.create_time)
		 // 		nitem.transCreatTime = ntime.year + '-' + ntime.month + '-' + ntime.day + ' ' + ntime.stime;
		 // 	}
		 // 	curItem.list.push(nitem)
		 // }
		 nlist.forEach(item => {
		 	let nbillList = item.billInfoList || [];
		 	item.billInfoList = nbillList.filter(citem => citem.goods_type == '975' || citem.goods_type == '811');
		 });
		 curItem.list = curItem.list.concat(nlist);
		 if (curItem.list.length > 0 && curItem.curPage > npage.totalPage) {
		 	curItem.loadingType = 'noMore';
		 } else {
		 	curItem.list.length > 0 ? (curItem.loadingType = 'more') : (curItem.loadingType = 'none');
		 }
		 navList.value[navClass.value].loaded='loaded'
		 console.log(navList.value[navClass.value],"navList.value[navClass.value]")
	}catch(e){
		curItem.loaded = true;
		curItem.loadingType = 'none';
		hideLoading();
		mapi.msg('网络繁忙，请稍后.');
	}
	
 }
 const transDay=(value :any= '') =>{
 	if (!value) {
 		return '';
 	}
 	let ntime:any = getTime(value);
 	return ntime.year + '-' + ntime.month + '-' + ntime.day;
 }
 const tapNav=(index:any)=> {
 	navClass.value = index;
 	loadData('tapClick');
 }
 const tapItemBtn=(index:any, billId:any, status:any)=> {
 	if (status == '988' || status == '225') {
 		//删除订单
 		changeOrderStatus(index, billId, 'SCDD');
 	} else {
 		status != '988' ? cancelOderBtn(index, billId) : navtoCreat();
 	}
 }
 const navtoCreat=()=> {
 	mnavTo('/order/creatOrder/creatOrder?resvId=' + ''); //暂
 }
 const cancelOderBtn=(index:any, billId:any)=> {
 	uni.showModal({
 		title: '提示',
 		content: '确定取消此订单吗？',
 		cancelText: '点错了',
 		confirmText: '确定',
 		confirmColor: '#56BF7A',
 		success: res => {
 			if (res.confirm) {
 				cancelOder(index, billId);
 			}
 		}
 	});
 }
 // 更改订单状态-删除
const changeOrderStatus=async(index:any, billId:any, action:any)=> {
 	let ndata = {
 		billId: billId,
 		action: action
 	};
 	uni.showModal({
 		title: '提示',
 		content: action == 'SCDD' ? '确定删除此订单吗？' : '确定取消此订单吗？',
 		cancelText: '点错了',
 		confirmText: '确定',
 		confirmColor: '#56BF7A',
 		success:async(res) => {
 			if (res.confirm) {
 				showLoading({
 					title: '',
 					mask: true
 				});
				try{
					let res= await changeOrderStatust(ndata)
					if (!res.result) {
						hideLoading();
						mapi.msg(res.shortMessage || '网络繁忙，请稍后..', res.code);
						return;
					}
					mapi.msg(action == 'SCDD' ? '删除成功' : '取消成功');
					refresh();
				}catch(e){
					hideLoading();
					mapi.msg('网络繁忙，请稍后.');
				}
 			}
 		}
 	});
 }
 //取消订单
 const cancelOder=async(index:any, billId:any)=> {
 	showLoading({
 		title: '',
 		mask: true
 	});
	try{
		let res=await cancelOdert({ billId: billId })
	  hideLoading();
		if (!res.result) {
			mapi.msg(res.shortMessage || '网络繁忙，请稍后..', res.code);
			return;
		}
		navList.value[navClass.value].list[index].bill_status='225'
		mapi.msg('取消成功！');
	}catch(e){
		hideLoading();
		mapi.msg('网络繁忙，请稍后.');
	}
 }
 const tapDetail=(item:any, data:any)=> {
	  curTapItem.value = item;
		dataList.value = data;
    pop1.value.open('002');
 }
 const transSubTime=(value:any, unit:any = '')=> {
 	if (!value) {
 		return '';
 	}
 	let r = value.substring(8, 10) + unit + value.substring(10, 12);
 	// console.log('rrrrrr+++',r)
 	return r;
 }
</script>

<style lang="scss" scoped>
page {
}
.pageContent {
	line-height: 1;
	padding-top: 110rpx;
}
.emptyOder {
	padding-top: 20%;
	position: absolute;
	width: 100vw;
	height: calc(100vh - 112rpx);
	background: #fff;
	text-align: center;
	left: 0;
	top: 0;
	z-index: 99;

	.emptyImg {
		width: 356rpx;
		height: 250rpx;

		image {
			width: 356rpx;
			height: 250rpx;
		}
	}

	.emty-ds {
		margin-top: 94rpx;
		font-size: 28rpx;
		color: #999;
	}

	.emty-btn {
		margin-top: 40rpx;
		width: 150rpx;
		height: 55rpx;
		line-height: 55rpx;
		text-align: center;
		color: #fff;
		border-radius: 4rpx;
		background: linear-gradient(90deg, rgba(40, 176, 91, 1) 0%, rgba(70, 183, 155, 1) 100%);
		font-size: 24rpx;
	}
}
.aprTitBox {
	height: 80rpx;
	line-height: 81rpx;
	font-size: 28rpx;
	// padding: 6rpx 20rpx 0 20rpx;
	text-align: center;
	position: fixed;
	left: 0;
	// #ifdef MP-WEIXIN
	top: 0;
	// #endif
	
	// #ifdef H5
	top: 44px;
	// #endif
	padding-bottom: 3rpx;
	width: 100vw;
	background: #fafafa;
	z-index: 9;
	&.shaw {
		box-shadow: 0px 4rpx 18rpx rgba(0, 0, 0, 0.08);
	}
	.titItem {
		width: 154rpx;
		height: 100%;
		position: relative;
		transition: all 0.03s linear;
		&.active {
			font-size: 36rpx;
			font-weight: bold;
			&::before {
				content: '';
				width: 44rpx;
				height: 6rpx;
				position: absolute;
				left: 50%;
				bottom: 2rpx;
				border-radius: 6rpx;
				margin-left: -22rpx;
				background: #56bf7a;
			}
		}
	}
}
.mtipsico{
	position: absolute;
	min-width: 56rpx;
	height: 30rpx;
	right: 0;
	top: 0;
	padding: 0 6rpx;
	border-radius:0 16rpx 0 16rpx;
	background: #FFB84D;
}
.aprMainBox {
	padding: 0 20rpx;
	min-height: 80vh;
	position: relative;
	.text-status {
		font-family: 'Microsoft YaHei UI';
		font-style: normal;
		font-weight: 400;
		font-size: 24rpx;
		line-height: 40rpx;
		margin-left: 15rpx;
		align-items: center;
		letter-spacing: 0.02em;
		color: rgba(102, 102, 102, 0.7);
		&.act {
			color: rgba(86, 191, 122, 0.7);
		}
	}
	.consumItem {
		width: 100%;
		min-height: 400rpx;
		margin-top: 30rpx;
		background-color: #fff;
		border-radius: 16rpx;
		box-shadow: 0px 4rpx 18rpx rgba(0, 0, 0, 0.08);
		font-size: 24rpx;
		padding: 40rpx 30rpx;
		box-sizing: border-box;
		&:nth-child(1) {
			margin-top: 0;
		}
		.cs_cname {
			font-size: 28rpx;
			font-weight: bold;
		}
		.aconIcoBox {
			display: inline-block;
			width: 40rpx;
			height: 40rpx;
			margin-right: 20rpx;
			line-height: 41rpx;
			text-align: center;
			font-weight: normal;
			border-radius: 50%;
			color: #fff;
			background-color: #56bf7a;
		}
		&.act {
			.cs_vproList {
				.vproItem {
					.vptime {
						color: #333;
						// color: #FF9700;
					}
				}
			}
			.cs_odid {
				color: #56bf7a;
			}
			.csproItem {
				.cstime {
					background: rgba(255, 151, 0, 0.3);
					border-radius: 48rpx;
					color: #ff9700;
					text-align: center;
				}
			}
			.cs_botsc {
				.bot_btn {
					&.ag {
						background: none;
						color: #56bf7a;
					}
				}
			}
		}
	}
	.cs_vproList {
		width: 100%;
		min-height: 160rpx;
		white-space: nowrap;
		margin-top: 32rpx;
		background: #f6f7f9;
		border-radius: 16rpx;
		padding: 20rpx 0;
		.dian {
			width: 36rpx;
			height: 24rpx;
			// margin-right: 310rpx;
			vertical-align: middle;
			display: inline-flex;
			justify-content: center;
			align-items: center;
			white-space: nowrap;
			box-sizing: border-box;
			font-size: 17rpx;
			font-weight: normal;
			border-radius: 56rpx 56rpx 56rpx 56rpx;
			background: #56bf7a;
			color: #fff;
		}
		.vproItem {
			padding: 20rpx 30rpx 0 30rpx;
			// margin-bottom: 30rpx;
			&:nth-last-child(1) {
				margin-bottom: 0;
				.linv:after {
					content: none;
				}
			}
		}
		.linv {
			padding-top: 20rpx;
		}
	}
	.cs_proList {
		margin-top: 32rpx;
		height: 200rpx;
		width: 100%;
		white-space: nowrap;
		// background-color: #F6F7F9;
	}
	.csproItem {
		display: inline-block;
		width: 196rpx;
		height: 196rpx;
		border-radius: 8rpx;
		background-color: #f6f7f9;
		margin-right: 30rpx;
		font-size: 24rpx;
		padding: 20rpx 12rpx;
		vertical-align: middle;
		&:nth-last-child(1) {
			margin-right: 0;
		}
		.csname {
			padding-top: 8rpx;
			font-size: 28rpx;
			font-weight: bold;
		}
		.cstime {
			height: 48rpx;
			line-height: 49rpx;
			margin-top: 18rpx;
			color: #666;
		}
		.csnum {
			color: #666;
			margin-top: 24rpx;
		}
		.mlfs {
			margin-left: 7rpx;
		}
	}
	.cs_botsc {
		margin-top: 32rpx;
		.bot_time {
			font-size: 28rpx;
			color: #000;
		}
		.bot_btn {
			width: 208rpx;
			height: 68rpx;
			line-height: 67rpx;
			border-radius: 68rpx;
			border: 1px solid #56bf7a;
			box-sizing: border-box;
			text-align: center;
			background-color: #56bf7a;
			color: #fff;
			// &.ag{
			// 	background-color: #56BF7A;
			// 	color: #fff;
			// }
		}
		.bot_btn_del {
			width: 208rpx;
			height: 68rpx;
			line-height: 67rpx;
			border-radius: 68rpx;
			border: 1px solid #666666;
			box-sizing: border-box;
			text-align: center;
			background-color: #fff;
			color: #666666;
		}
	}
}
.tit_tah {
	font-size: 24rpx;
	margin-left: 4rpx;
}
</style>